<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>INSPINIA | Basic Form</title>
	<link href="#springUrl('/static/css/bootstrap.min.css')" rel="stylesheet">
	<link href="#springUrl('/static/css/style.css')" rel="stylesheet">
</head>
<body class="white-bg">
<div class="ibox-content" style="width: 430px;">
   <form id="myForm" class="form-horizontal" autocomplete="off" data-validator-option="{theme:'default'}">

       <div class="form-group"><label class="col-sm-2 control-label">商品名称</label>
           <div class="col-sm-10">
               <!--<input type="text" class="form-control"  name="itemName" >
               <input type="hidden" class="form-control"  name="itemId" >-->
               <select id="itemId"  class="form-control" name="itemId">
                   #foreach($item in $!{itemList})
                   <option value="$!{item.id}" >$!{item.itemName}</option>
                   #end
               </select>
           </div>
       </div>
       <div class="form-group"><label class="col-sm-2 control-label">商品规格</label>
           <div class="col-sm-10">
                <p ><label>  <input name="propertyKey" id="propertyKey0" type="checkbox" value="0" />色号：</label><label><input  id="propertyDesc0" name="propertyDesc0" >   多个数据用空格分隔</label></p>
                <p><label> <input name="propertyKey" id="propertyKey1" type="checkbox" value="1" />容量：</label><label><input  id="propertyDesc1" name="propertyDesc1" >   多个数据用空格分隔</label></p>
               <p><label><input name="propertyKey" id="propertyKey2" type="checkbox" value="2" />数量：</label><label><input  id="propertyDesc2" name="propertyDesc2" >   多个数据用空格分隔</label></p>
               <p><label><input name="propertyKey" id="propertyKey3" type="checkbox" value="3" />重量：</label><label><input  id="propertyDesc3" name="propertyDesc3" >   多个数据用空格分隔</label></p>
           </div>
       </div>
       <!--<div class="hr-line-dashed"></div>
       <div class="form-group"><label class="col-sm-2 control-label">属性值</label>
           <div class="col-sm-10">
           		<input type="text" class="form-control" name="propertyValue" >
           </div>
       </div>
       <div class="hr-line-dashed"></div>
       <div class="form-group"><label class="col-sm-2 control-label">属性描述</label>
           <div class="col-sm-10">
               <input type="text" class="form-control" name="propertyDesc" >
           </div>
       </div>
       <div class="hr-line-dashed"></div>-->
        <!--<div class="form-group"><label class="col-sm-2 control-label">用户角色</label>
            <div class="col-sm-10">
            <select class="form-control m-b" name="rid">
            	#foreach($role in $roleList)
                <option id="$!{role.id}">$!{role.name}</option>
                #end
            </select>
            </div>
        </div>
        <div class="hr-line-dashed"></div>-->
        <div class="form-group">
            <div class="text-center">
                <!--<button class="btn btn-primary" onclick="btnSubmit()"  type="button">提交</button>-->
                <button class="btn btn-primary"  type="submit">提交</button>
            </div>
        </div>
    </form>
</div>
<script src="#springUrl('/static/js/jquery-2.1.1.js')"></script>
<script src="#springUrl('/static/plugins/nice-validator-0.8.1/jquery.validator.js?local=zh-CN')"></script>
<script src="#springUrl('/static/js/jquery-ui.custom.min.js')"></script>
<script src="#springUrl('/static/js/jquery-ui-1.10.4.min.js')"></script>
<script src="#springUrl('/static/plugins/layer-v2.2/layer/layer.js')"></script>
<script type="text/javascript">

    /*function btnSubmit(){
        var arr = new Array();
        var itemId = $("#itemId").val();
        var jsonObj={};
        var objCheck = document.getElementsByName("propertyKey");
        //console.log(objCheck[0].checked)
        for(var i=0;i<objCheck.length;i++){
             var ck =  objCheck[i]
            if(ck.checked==true){
                    var sss = '#propertyDesc'+ck.value;
                    var obj = $(sss);
                    var pd = $.trim(obj.val());
                    var split = pd.split(" ");
                    $.each(split,function(j,n){
                        jsonObj = {'itemId':itemId,'propertyKey':i,'propertyValue':j,'propertyDesc':n};
                        arr.push(jsonObj);
                    });
            }
        }
        if(arr==null){
            alert("请设置商品的属性值！");
            return;
        }
        var json  = JSON.stringify(arr);
        $.ajax({
            url: "#springUrl('/item/itemproperties/addItemProperty')",
            data: json,
            type: "POST",
            contentType:"application/json",
            success: function(data){
                var d = JSON.parse(data);
                if(d.success && d.data){
                    window.parent.location.reload();
                    //当你在iframe页面关闭自身时
                    //var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    //parent.layer.close(index); //再执行关闭
                } else {
                    //失败，提交表单成功后，释放hold，如果不释放hold，就变成了只能提交一次的表单
                    // me.holdSubmit(false);
                }
            }
        });
    }*/

$("#myForm").validator({
    valid: function(form){
        var me = this;
        // 提交表单之前，hold住表单，防止重复提交
        me.holdSubmit();

        var arr = new Array();
        var itemId = $("#itemId").val();
        var jsonObj={};
        var objCheck = document.getElementsByName("propertyKey");
        //console.log(objCheck[0].checked)
        for(var i=0;i<objCheck.length;i++){
            var ck =  objCheck[i]
            if(ck.checked==true){
                var sss = '#propertyDesc'+ck.value;
                var obj = $(sss);
                var pd = $.trim(obj.val());
                var split = pd.split(" ");
                $.each(split,function(j,n){
                    jsonObj = {'itemId':itemId,'propertyKey':i,'propertyValue':j,'propertyDesc':n};
                    arr.push(jsonObj);
                });
            }
        }
        if(arr==null){
            alert("请设置商品的属性值！");
            return;
        }
        var json  = JSON.stringify(arr)
        $.ajax({
        	url: "#springUrl('/item/itemproperties/addItemProperty')",
            data: json,
            type: "POST",
            contentType:"application/json",
            success: function(data){
            	var d = JSON.parse(data);
                if(d.success && d.data){
                	window.parent.location.reload();
                	//当你在iframe页面关闭自身时
                	//var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                	//parent.layer.close(index); //再执行关闭
                } else {
                	//失败，提交表单成功后，释放hold，如果不释放hold，就变成了只能提交一次的表单
                   me.holdSubmit(false);
                }
            }
        });
    }
});
</script>
</body>
</html>